<kubernetes-view-header title="Dashboard" state="kubernetes.dashboard" view-ready="ctrl.state.viewReady"> Environment summary </kubernetes-view-header>

<kubernetes-view-loading view-ready="ctrl.state.viewReady"></kubernetes-view-loading>

<div ng-if="ctrl.state.viewReady">
  <div class="row" ng-if="ctrl.endpoint">
    <div class="col-sm-12">
      <rd-widget>
        <rd-widget-header icon="fa-tachometer-alt" title-text="Environment info"></rd-widget-header>
        <rd-widget-body classes="no-padding">
          <table class="table">
            <tbody>
              <tr>
                <td>Environment</td>
                <td>
                  {{ ctrl.endpoint.Name }}
                </td>
              </tr>
              <tr>
                <td>URL</td>
                <td>{{ ctrl.endpoint.URL | stripprotocol }}</td>
              </tr>
              <tr>
                <td>Tags</td>
                <td>{{ ctrl.endpointTags }}</td>
              </tr>
            </tbody>
          </table>
        </rd-widget-body>
      </rd-widget>
    </div>
  </div>

  <div class="row">
    <div class="col-xs-12 col-md-6" ng-if="ctrl.pools" data-cy="k8sDashboard-namespaces">
      <a ui-sref="kubernetes.resourcePools">
        <rd-widget>
          <rd-widget-body>
            <div class="widget-icon blue pull-left">
              <i class="fa fa-layer-group"></i>
            </div>
            <div class="title">{{ ctrl.pools.length }}</div>
            <div class="comment">{{ ctrl.pools.length === 1 ? 'Namespace' : 'Namespaces' }}</div>
          </rd-widget-body>
        </rd-widget>
      </a>
    </div>
    <div class="col-xs-12 col-md-6" ng-if="ctrl.applications" data-cy="k8sDashboard-applications">
      <a ui-sref="kubernetes.applications">
        <rd-widget>
          <rd-widget-body>
            <div class="widget-icon blue pull-left">
              <i class="fa fa-laptop-code"></i>
            </div>
            <div class="title">{{ ctrl.applications.length }}</div>
            <div class="comment">{{ ctrl.applications.length === 1 ? 'Application' : 'Applications' }}</div>
          </rd-widget-body>
        </rd-widget>
      </a>
    </div>
    <div class="col-xs-12 col-md-6" ng-if="ctrl.configurations" data-cy="k8sDashboard-configurations">
      <a ui-sref="kubernetes.configurations">
        <rd-widget>
          <rd-widget-body>
            <div class="widget-icon blue pull-left">
              <i class="fa fa-file-code"></i>
            </div>
            <div class="title">{{ ctrl.configurations.length }}</div>
            <div class="comment">{{ ctrl.configurations.length === 1 ? 'Configuration' : 'Configurations' }}</div>
          </rd-widget-body>
        </rd-widget>
      </a>
    </div>
    <div class="col-xs-12 col-md-6" ng-if="ctrl.volumes" data-cy="k8sDashboard-volumes">
      <a ui-sref="kubernetes.volumes">
        <rd-widget>
          <rd-widget-body>
            <div class="widget-icon blue pull-left">
              <i class="fa fa-database"></i>
            </div>
            <div class="title">{{ ctrl.volumes.length }}</div>
            <div class="comment">{{ ctrl.volumes.length === 1 ? 'Volume' : 'Volumes' }}</div>
          </rd-widget-body>
        </rd-widget>
      </a>
    </div>
  </div>
</div>
